<template>
  <div style="display: flex;flex-direction: column;height: calc(100vh - 55px)">
    <div class="flex-1">
      <vxe-table row-id="id"
                 height="auto"
                 @checkbox-change="checkBoxChange"
                 @checkbox-all="checkBoxChange"
                 :checkbox-config="{labelField: 'name',checkRowKeys:grantMenu}"
                 ref="table"
                 :data="dataList"
                 highlight-hover-row
                 :row-config="{height: 48}"
                 :stripe="false"
                 border
                 :loading="loading">
        <vxe-column type="checkbox" title="门店名称" field="name"/>
      </vxe-table>
    </div>
  </div>
</template>

<script>
import Role from "@js/api/Role";
import {message} from "heyui";
import Menu from "@js/api/Menu";
import Organization from "@js/api/Organization";

/**
 * @功能描述: 角色机构
 * @创建时间: 2023年08月08日
 * @公司官网: www.fenxi365.com
 * @公司信息: 纷析云（杭州）科技有限公司
 * @公司介绍: 专注于财务相关软件开发, 企业会计自动化解决方案
 */
export default {
  name: "GrantMenu",
  props: {
    entity: Object,
    merchant: Object,
  },
  data() {
    return {
      loading: false,
      dataList: [],
      grantMenu: [],
    }
  },
  methods: {
    checkBoxChange({records}) {
      this.loading = true;
      Role.roleOrgGrant(this.entity.id, records.map(val => val.id)).then(() => {
        message("授权成功~");
      }).finally(() => this.loading = false);
    },
    loadData() {
      this.loading = true;
      Promise.all([
        Organization.listAll(),
        Role.getRoleOrg(this.entity.id)
      ]).then((results) => {
        this.dataList = results[0].data || [];
        this.grantMenu = results[1].data;
      }).finally(() => this.loading = false);
    }
  },
  created() {
    this.loadData();
  }
}
</script>

<style scoped lang="less">
.m-cus-menu {
  height: calc(100vh - 150px);
  overflow: hidden;
}
</style>
